import Vue from 'vue'
import VueRouter from 'vue-router'
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'
import api from "../util/api";
// 引入微信sdk
import cloudbase from "@cloudbase/js-sdk";
// 初始化SDK
const app = cloudbase.init({
  env: api.envid,
});
// 登录时效，用户显式退出或更改密码之前的30天一直有效
const auth = app.auth({
  persistence: "local",
});
// 首页
import Home from '../views/personal/home.vue'
// 登录页面
import login from "../views/login/login.vue"
// 404
import error404 from "../views/404.vue"

// 个人中心页面
import personal from "../views/template.vue"
import home from "../views/personal/home.vue"
import about from "../views/personal/about.vue"
import music from "../views/personal/music.vue"
import fund from "../views/personal/fund.vue"
import userblog from "../views/personal/userblog.vue"
import addblog from "../views/personal/addblog.vue"
import productList from "../views/personal/productList.vue"
import blogDetail from "../views/blog-detail/blog-detail.vue"

// 系统管理页面
import system from "../views/template.vue"
import menusettings from "../views/system/menu-settings.vue"
import usersettings from "../views/system/user-settings.vue"
import message from "../views/template.vue"
import message_tem from "../views/system/message/message-template.vue"
import message_lis from "../views/system/message/message-list.vue"
import test from "../views/system/message/test.vue"

// 跳转的页面
import addProduct from "../views/auxiliaryPage/addProduct.vue"



// 解决ElementUI导航栏中的vue-router在3.0版本以上重复点菜单报错问题
const originalPush = VueRouter.prototype.push;
VueRouter.prototype.push = function push(location) {
  return originalPush.call(this, location).catch(err => err)
}

Vue.use(VueRouter)

const routes = [{
    path: '/',
    name: '首页',
    component: Home,
    // meta.keepAlive用来控制是否显示左侧菜单栏
    meta: {
      keepAlive: true
    }
  },
  // 登录
  {
    path: "/login",
    name: "登录",
    component: login,
    meta: {
      keepAlive: false
    }
  },
  // 添加商品页面
  {
    path: "/addProduct",
    name: "添加商品",
    component: addProduct,
    meta: {
      keepAlive: true
    }
  },
  // 个人中心
  {
    path: "/personal",
    name: "个人中心",
    component: personal,
    meta: {
      keepAlive: true
    },
    children: [{
        path: 'home',
        name: '我的首页',
        component: home,
        meta: {
          keepAlive: true
        }
      },
      {
        path: 'about',
        component: about,
        name: '图片上传',
        meta: {
          keepAlive: true
        }
      },
      {
        path: "music",
        component: music,
        name: '音乐列表',
        meta: {
          keepAlive: true
        }
      },
      {
        path: "fund",
        component: fund,
        name: '我的基金',
        meta: {
          keepAlive: false
        }
      },
      {
        path: "userblog",
        component: userblog,
        name: '个人博客',
        meta: {
          keepAlive: true
        }
      },
      {
        path: "addblog",
        component: addblog,
        name: '添加博客',
        meta: {
          keepAlive: true
        }
      },
      {        
        path: "blogDetail",
        component: blogDetail,
        name: '查看博客',
        meta: {
          keepAlive: true
        }
      },
      {
        path: "productList",
        component: productList,
        name: '商品列表',
        meta: {
          keepAlive: true
        }
      },
    ]
  },
  // 系统管理
  {
    path: "/system",
    name: "系统管理",
    component: system,
    meta: {
      keepAlive: true
    },
    children: [{
        path: 'menusettings',
        name: '菜单管理',
        component: menusettings,
        meta: {
          keepAlive: true
        }
      },
      {
        path: 'usersettings',
        component: usersettings,
        name: '用户管理',
        meta: {
          keepAlive: true
        }
      },
      {
        path: '/system/message',
        component: message,
        name: '消息管理',
        meta: {
          keepAlive: true
        },
        children: [{
            path: 'message_tem',
            component: message_tem,
            name: '消息模板',
            meta: {
              keepAlive: true
            }
          },
          {
            path: 'message_lis',
            component: message_lis,
            name: '消息列表',
            meta: {
              keepAlive: true
            }
          },
          {
            path: 'test',
            component: test,
            name: '测试页面',
            meta: {
              keepAlive: true
            }
          }

        ]
      }
    ]
  }, {
    path: "/404",
    name: "404",
    component: error404
  }
]

const router = new VueRouter({
  routes
})





// 路由守卫
router.beforeEach((to, from, next) => {
  document.title = to.name;
  if (!to.name) {
    // 登录状态有效，显示页面跳转时进度条
    NProgress.start();
    // 如果跳转的页面不存在，进入到404页面
    next("/404")
  }
  // 登录成功后异步判断登录状态
  auth.getLoginState().then((loginState) => {
    console.log(loginState, "路由状态");
    if (loginState) {
      // 登录状态有效，显示页面跳转时进度条
      NProgress.start();
      // 如果存在token 放行
      next()
    } else {
      // 没有登录态，或者登录态已经失效     
      if (to.path === '/login') {
        next()
      } else {
        // 当前页面不是登录页 则直接跳转到登陆页面
        next('/login')
      }
    }
  });
});

router.afterEach(() => {
  // 关闭跳转进度条
  NProgress.done();
});

export default router
